<template>
  <div>
    <div class="attenduser-title mb10">
      参与考勤人员
    </div>
    <org-items v-model="select" @selectOrg="selectOrg('yes')"/>
    <!--    <div class="attenduser-title mb10 mt20">-->
    <!--      无需考勤人员-->
    <!--    </div>-->
    <!--    <org-items v-model="not_select" @selectOrg="selectOrg('no')"/>-->
    <org-picker multiple ref="orgPicker" :selected="selectList" @ok="selected"/>
  </div>
</template>

<script>
import {getOvertimeRules, addOvertimeRules, updateOvertimeRules} from '@/api/system/rulesOverTime.js'
import OrgPicker from "@/components/common/OrgPicker";
import OrgItems from "@/views/approval/design/common/process/OrgItems";

export default {
  props: ['config'],
  name: "editRule",
  components: {OrgPicker, OrgItems},
  data() {
    return {
      name: '',
      activeName: 'first',
      radio: 3,
      select: [],
      not_select: [],
      userType: '',
      selectList: []
    }
  },
  mounted() {
    console.log('this.config:', this.config)
    if (this.config) {
      this.select = this.$deepCopy(this.config)
      this.selectList = this.$deepCopy(this.config)
    }
  },
  methods: {
    selectOrg(option) {
      this.userType = option
      if (this.userType === 'yes') {
        this.selectList = this.$deepCopy(this.select)
      } else {
        this.selectList = this.$deepCopy(this.not_select)
      }
      this.$refs.orgPicker.show()
    },
    selected(select) {
      console.log(select)
      if (this.userType === 'yes') {
        this.select = Object.assign([], select)
      } else {
        this.not_select = Object.assign([], select)
      }
    },
    submit() {
      this.$emit('checkRuleGet', {
        type: 'attend_user',
        data: this.$deepCopy({
          can: this.select,
          not: this.not_select
        })
      })
    }
  }
}
</script>

<style scoped>
.attenduser-title {
  font-size: 14px;
}
</style>
